<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="../common/common.jsp"%>
<link rel="stylesheet" href="${ctx}/page/shop/css/orderAccount.css">
<script type="text/javascript" src="${ctx}/page/shop/js/orderAccount.js"></script>
<script type="text/javascript" src="${ctx}/page/member/js/address.js"></script>
<title>订单结算</title>
</head>
<body>
		<%@ include file="../common/header.jsp"%>
		<div class="container">
			<div class="row">
				<div class="col-md-9">
					<div class="panel panel-default">
						<div id="headingDiv" class="panel-heading">填写核对订单信息--->成功提交订单</div>
						<div class="panel-body">
							<h4>商品清单</h4>
							<div class="divide"></div>
							<c:forEach items="${shoppingCart.items}" var="shoppingCartItem">
								<div class="media">
									<div class="media-left">
										<a class="media-left" href="${ctx}/product/${shoppingCartItem.product.id}"> 
											<img src="${shoppingCartItem.product.smallImage}" class="avatar">
										</a>
									</div>
									<div class="media-body productInfo">
										<a style="color: #333333" class="title" href="${ctx}/product/${shoppingCartItem.product.id}">
											<h5 class="media-heading">${shoppingCartItem.product.name}</h5>
										</a> 
										<small>
											<span class="hidden-sm hidden-xs">规格:${shoppingCartItem.productSkuRelation.skuValue1}${shoppingCartItem.productSkuRelation.skuValue2}</span> 
												&nbsp&nbsp 
											<span class="hidden-sm hidden-xs">单价:&yen<fmt:formatNumber type="number" value="${shoppingCartItem.productSkuRelation.price}" pattern="0.00" maxFractionDigits="2"/></span> 
												&nbsp&nbsp 
											<span class="hidden-sm hidden-xs">数量:${shoppingCartItem.counts}</span>
												&nbsp&nbsp 
											<span class="hidden-sm hidden-xs">小计:&yen<fmt:formatNumber type="number" value="${shoppingCartItem.value}" pattern="0.00" maxFractionDigits="2"/></span>
										</small>
									</div>
								</div>
							</c:forEach>
							<h4 class="addressTitle">收货人信息</h4>
							<div class="divide addressInfo"></div>
							<span id="address_info" >
								<c:if test="${address eq null}">
									<button class="btn btn-default addAddressBtn" data-toggle="modal" data-target="#myModal">新增地址</button>
								</c:if>
								<c:if test="${address ne null}">
									${address.name}&nbsp${address.province}&nbsp${address.city}&nbsp${address.district}&nbsp${address.detail} &nbsp${address.mobile}&nbsp 
									<a href="javascript:;" class="label label-success" data-toggle="modal" data-target="#myModal">修改</a>
								</c:if>
							</span>
							<h4 class="addressTitle">备注</h4>
							<textarea name="remark" id="remark" rows="2" class="form-control"></textarea>
						</div>
						<div class="panel-footer">
							总共<strong>${shoppingCart.counts}</strong>件商品
							&nbsp&nbsp总计<strong>&yen<fmt:formatNumber type="number" value="${shoppingCart.value}" pattern="0.00" maxFractionDigits="2"/></strong>
							&nbsp&nbsp需支付<strong style="color: #c61822"><fmt:formatNumber type="number" value="${shoppingCart.value}" pattern="0.00" maxFractionDigits="2"/></strong>积分
							<button id="commitBtn" class="pull-right btn btn-default commitButton" onclick="orderCommit()">
								<span class="glyphicon glyphicon-check"></span>
								提交订单
							</button>
						</div>
					</div>
				</div>
				<div class="col-md-3 hidden-sm hidden-xs">
					<%@ include file="../include/memberInfoInShop.jsp"%>
				</div>
			</div>
		</div>
		<%@ include file="../common/footer.jsp"%>
	</div>
	<!-- Modal -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	  <div class="modal-dialog">
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
	        <h4 class="modal-title" id="myModalLabel">新增/修改收货地址</h4>
	      </div>
	      <div class="modal-body">
				<div class="form-group">
					<label for="name">收货人</label> 
					<input type="text"	class="form-control" id="name" value="${address.name}" />
				</div>
				<div class="form-group">
					<label for="mobile">手机号</label> 
					<input type="text"	class="form-control" id="mobile" value="${address.mobile}" />
				</div>
				<div class="form-group">
					<label for="cmbProvince">省</label>
					<select id="cmbProvince" name="cmbProvince" class="form-control"></select>
				</div>
				<div class="form-group">
					<label for="cmbCity">市</label>
					<select id="cmbCity" name="cmbCity" class="form-control"></select> 
				</div>
				<div class="form-group">
					<label for="cmbArea">区</label>
					<select id="cmbArea" name="cmbArea" class="form-control"></select>
				</div>
				<div class="form-group">
					<label for="detail">详细地址</label> 
					<input type="text" class="form-control" id="detail" value="${address.detail}" />
				</div>
	      </div>
	      <div class="modal-footer">
	      	<span id="error_message"></span>
	        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
	        <button onclick="addUpdateAddress()" type="button" class="btn btn-primary">保存</button>
	      </div>
	    </div>
	  </div>
	<script type="text/javascript">
 		addressInit('cmbProvince', 'cmbCity', 'cmbArea');  
	</script>
</body>
</html>